.px2rem(@name, @px){
    @{name}: @px / 75 * 1rem;
}
body{
	background: #fafafa;
}
.head{
	background: #f84183;
	.px2rem(height, 92);
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 99;
	article{
		width: 18%;
		display: flex;
		align-items: center;
		justify-content: center;
		img{
			width: 80%;
		}
	}
	p{
		background: #fff;
		.px2rem(padding-top, 15);
		.px2rem(padding-bottom, 15);
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 50%;
		border-radius: 5px;
		input{
			border:none;
			.px2rem(margin-left, 10);
			outline: none;
			width: 90%;
			.px2rem(font-size, 20);
		}
		img{
			.px2rem(margin-right, 10);
			.px2rem(height, 30);
		}
	}
	.yonghu{
		.px2rem(width, 85);
		.px2rem(height, 85);
	}
	aside{
		.px2rem(width, 85);
		height: 100%;
		background: #a51658;
		display: flex;
		align-items: center;
		justify-content: center;
	}
}
.title{
	.px2rem(margin-top, 92);
	.px2rem(padding-top, 50);
	.px2rem(padding-bottom, 50);
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	h4{
		.px2rem(font-size, 28);
		letter-spacing: 1em;
	}
	img{
		width: 50%;
	}
}
.banner{
	display: flex;
	justify-content: center;
	align-items: center;
	img{
		width: 94%;
	}
}
.jieshao{
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	p{
		width: 92%;
	}
	p:first-child{
		color: #f84183;
		.px2rem(font-size, 28);
		.px2rem(padding-top, 30);
		.px2rem(padding-bottom, 10);
	}
	p:last-child{
		color: #666666;
		.px2rem(line-height, 42);
		.px2rem(font-size, 26);
		.px2rem(padding-top, 5);
		.px2rem(padding-bottom, 20);
	}
}
.button{
	.px2rem(margin-top, 20);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	ul{
		width: 92%;
		display: flex;
		justify-content: space-between;
		li{
			width: 30%;
			.px2rem(height, 45);
			display: flex;
			border:1px solid #dcdcda;
			align-items: center;
			justify-content: center;
			border-radius: 4px;
			img{
				.px2rem(height, 35);
			}
			a{
				color: #727272;
			}
		}
	}
	button{
		.px2rem(margin-top, 100);
		width: 35%;
		border:none;
		background: #a51658;
		border-radius: 4px;
		color: #fff;
		.px2rem(height, 48);
		.px2rem(font-size, 25);
	}
}
.footer{
	.px2rem(margin-top, 80);
	width: 100%;
	background: #7d7d7d;
	.px2rem(height, 66);
	text-align: center;
	p{
		.px2rem(line-height, 66);
		color: #fff;
		.px2rem(font-size, 25);
	}
}


.mengceng{
	height: 100%;
	width: 100%;
	display: none;
	position: fixed;
	top:0;
	left: 0;
	z-index: 9;
	background: #333;
	opacity: 0.7;
}
.mengceng2{
	width: 100%;
	height: 100%;
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 90;
	background: #fff;
	opacity: 0.7;
}
.list{
	display: none;
	section{
		display: flex;
		justify-content: center;
		background: #a51658;
		position: fixed;
		.px2rem(top, 92);
		width: 100%;
		z-index: 199;
		ul{
			width: 98%;
			li{
				display: flex;
				.px2rem(height, 80);
				align-items: center;
				border-bottom: 1px solid #b74579;
				p{
					flex:1;
					.px2rem(margin-left, 20);
					span{
						color: #ae3f6d;
					}
					span:first-child{
						.px2rem(font-size, 30);
						.px2rem(padding-left, 15);
					}
					span{
						flex:1;
						text-align: center;
					}
				}
				span{
					flex:1;
					text-align: center;
				}
				a{
					flex:1;
					text-align: center;
					color: #fff;
					.px2rem(font-size, 25);
				}
			}
		}
	}
}